<template>
	<el-popover
		v-model="visible"
		title="筛选更多"
		:width="width"
		placement="bottom"
	>
		<slot></slot>
		<div style="text-align: right; margin-top: 10px">
			<el-button size="mini" type="default" icon="el-icon-refresh-right" @click="onResetBtn">重置</el-button>
			<el-button type="primary" size="mini" icon="el-icon-search" @click="onConfirmBtn">搜索</el-button>
		</div>
		<el-tooltip slot="reference" class="item" effect="dark" content="筛选更多" placement="top-start">
			<el-button type="primary" icon="el-icon-more" :size="size"></el-button>
		</el-tooltip>
	</el-popover>
</template>
<script>
    export default {
        name: 'JkMoreSearchButton',
        props: {
            size: {
                type: String,
                default: 'small'
            },
            width: {
                type: String,
                default: '500'
            }
        },
        data() {
            return {
                visible: false
            };
        },
        mounted() {
        },
        methods: {
            onResetBtn() {
                this.$emit('on-reset');
            },
            onConfirmBtn() {
                this.visible = false;
                this.$emit('on-confirm');
            }
        }

    };
</script>
